<template>
  <div>
    <Header />
    <div class="back">
      <div class="container">
        <Nested :list='nestedList' />
        <div class="default-box">
          <div class="box-header flex">
            <div class="box-title">
              <div class="vertical-line" />
              <span>测录取概率</span>
            </div>
            <div class="flex">
              成绩：北京 历史/物理/化学 450分 31535名 <div>我的志愿表</div>
            </div>
          </div>

          <div class="content">
            <Filter :list="provinces" :selectList="selectList" title="院校省份" />
            <Filter :list="major" :selectList="selectList" title="院校类型" />
            <Filter :list="schoolType2" :selectList="selectList" title="学校层次" />
            <Filter :list="schoolLevel" :selectList="selectList" title="学校级别" />
          </div>
        </div>
        <div class="content">
          <div class="nav">
            <div class="select-nav flex">
              <div :class="{ active: index === selectIndex }" v-for="(item, index) in navList" @click="selectIndex = index">
                {{ item.name }}{{ item.num }}</div>
            </div>
          </div>

          <template>
            <Table :columns="columns" :data-source="data" bordered size="middle" />
          </template>
        </div>
      </div>
      <Footer />
    </div>
  </div>
</template>

<script lang="ts" setup>
import Header from '../../components/header/index.vue'
import Nested from '@/components/nested/index.vue'
import universityList from '@/components/universityList/index.vue'
import Footer from '@/components/footer/index.vue'
import Filter from '@/components/filter/index.vue'
import { provinces, major, schoolType2, schoolLevel } from '@/components/universityNavList/data'
import { ref } from 'vue'
import { NestedType } from '@/components/nested/nested';
import { Table } from 'ant-design-vue'
import { columns } from './data'

const nestedList = ref<NestedType[]>([{ name: '首页', path: '/' }, { name: '录取概率' }])
const selectList = ref<string[]>(['全部', '山东', '北京', '不限'])
//全部 可冲击 较稳妥 可保底
const navList = ref<any>([{ name: '全部', num: 1400 }, { name: '可冲击', num: 30 }, { name: '较稳妥', num: 58 }, { name: '可保底', num: 855 }])
const selectIndex = ref(0)



const data: any = generateData();

// 生成随机整数
function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

// 生成随机表格数据
function generateData() {
  const data: any = [];
  for (let i = 0; i < 3; i++) {
    const record: any = {
      admissionProbability: Math.random(),
      university: `University ${i + 1}`,
      enrollmentCode: `Code ${i + 1}`,
      enrollmentCount: getRandomInt(50, 200),
      additionalSelection: `Selection ${i + 1}`,
      minimumScore: getRandomInt(60, 100),
      minimumRank: getRandomInt(1, 100),
      admissionCount: getRandomInt(30, 100),
      admissionBrochure: `Brochure ${i + 1}`,
    };
    data.push(record);
  }
  return data;
}
</script>

<style lang="less" scoped>
@import './index.less';
</style>
